<template>
	<view class="page">
		<scroll-view scroll-y="true" class="selected-list-box">
			<view class="selected-list">
					<block v-for="(dItem,dIndex) in selectedList":key="dIndex">
						<view v-for="(tItem,tIndex) in dItem.times":key="tIndex" class="dis-flex item flex-y-center flex-x-between">
							<view class="">
								<view class="index f_24 gery">第{{ checkSelectTimeIndex(dItem.date, tIndex) }}课</view>
								<view class="navy_blue date">
									<text class="f_32">{{ returnDayAWeek(dItem.date) }} {{tItem}}</text>
								</view>
							</view>
							<view class="" @tap="bindTime(dItem.date)">
								<image :src="imgPrefix('/static/image/icon/select_time_next.png')" lazy-load></image>
							</view>
						</view>
					</block>
			</view>
		</scroll-view>
		<view @tap="bindAgainSelectTime" class="f_24 gery1 t-c m-t-24">重新排理</view>
		<view class="btn-box">
			<view class="btn" @tap="bindSendBtn">提交</view>
		</view>
	</view>
</template>

<script>
const app =getApp();
import { format } from '@/static/uitls/common.js';
	export default{
		name:'selected-time',
		data(){
			return{}
		},
		computed:{
		//处理列表显示的下标
		checkSelectTimeIndex: function() {
			return function aaa(dayStr, index) {
				let { selectedList } = this;
				let num = 0;
				let judge = true;
				if (judge) {
					for(let i in selectedList){
						for(let tIndex=0;tIndex<selectedList[i].times.length;tIndex++){
							if(judge){
								num++
							}
							if(judge&&selectedList[i].date==dayStr&&tIndex==index){
								judge = false
							}
						}
					}
					return num;
				}
			};
		},
		
		selectedList:function(){// 已经选择了的时间列表
			let {bindDayList}=this;
			let dkeysSorted = Object.keys(bindDayList).sort((a,b)=>{ return new Date(a) - new Date(b)})
			let newD = [];
			dkeysSorted.forEach((e,i)=>{
				let obj  = {date:e,times:[]};
				let {selectTimeList} = bindDayList[e];
				let tkeysSorted = Object.keys(selectTimeList).sort((a,b)=>{ return new Date(e+' '+selectTimeList[a].split(':')[0]+':00') - new Date(e+' '+selectTimeList[b].split(':')[0]+':00')})
				// app._log(tkeysSorted)
				tkeysSorted.forEach((te,ti)=>{
					obj.times.push(selectTimeList[te])
				})
				newD.push(obj);
			})
			return newD;
		},
		bindDayList:function(){
				let pages=getCurrentPages();//页面指针数组
				let prepage=pages[pages.length-2];//上一页面指针
				return prepage.data.bindDayList;
			}
		},
		methods:{
			// 返回节点日期和星期
			returnDayAWeek(monthStr, dayStr) {
				return format(new Date(monthStr), 'yyyy年MM月dd日') + ' 周' + '日一二三四五六'.charAt(new Date(monthStr).getDay());
			},
			// 点击重新调整
			bindAgainSelectTime(){
				uni.showModal({
					title:'重新调整',
					content:'是否把已选课次时间进行重新调整？',
					cancelText:'取消',
					confirmText:'确定',
					success:res=>{
						if(res.confirm){
							uni.$emit("watchArr",{clear:true});
							uni.navigateBack({delta:1})
						}
					}
				})
			},
			// 点击某节点时间
			bindTime(day){ //点击对应时间，返回上一页面并携带参数
				uni.$emit("watchDay",{day:day});
				uni.navigateBack({delta:1})
			},
			// 点击发送按钮
			bindSendBtn(){
				uni.$emit("watchArr",{bindDayList: this.bindDayList});
				uni.navigateBack({delta:2})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.page{
		padding: 24rpx 48rpx;
	}
	.selected-list-box{
		background-color: #ffffff;
		border-radius: 32rpx;
		padding: 24rpx 0;
	}
	.selected-list{
		background: white;
		max-height: 886rpx;
		.index{
			margin-bottom: 10rpx;
		}
		image{
			width: 32rpx;
			height: 32rpx;
		}
		.item{
			padding: 24rpx 0;
			margin: 0 24rpx;
			border-bottom: 1px solid rgba(237,237,237,0.7);
		}
		.date{
			text{
				margin-right: 15rpx;
			}
		}
	}
.item:last-child{
	border-bottom: 0px;
}
.m-t-24{
	margin-top: 24rpx;
}
.btn-box{
	position: fixed;
	bottom:0;
	padding-bottom: calc(52rpx + constant(safe-area-inset-bottom));
	padding-bottom: calc(52rpx + env(safe-area-inset-bottom));
	width: 654rpx;
}
.btn{
	text-align: center;
	line-height: 92rpx;
	color: white;
	background-image: linear-gradient(270deg, 
			#9254ff 0%, 
			#7f4aff 100%);
	border-radius: 24rpx;
}
</style>
